define(['vue','ELEMENT'],function (Vue,ELEMENT){
    return {
        template:`<div class="flex-column" :style="{width:width}">
<div class="flex-column">
    <div class="flex-row flex-content-around">
    <div style="width: 30%">名称</div>
    <div style="width: 30%">值</div>
    <div style="width: 30%">操作</div>
</div>
<div v-for="(tabs,index) in inputValue" class="flex-row flex-content-between" style="margin: 5px">
<div style="width: 30%"><el-input v-model="tabs.label"></el-input></div>
<div style="width: 30%"><el-input v-model="tabs.value"></el-input></div>
<div style="width: 30%"><el-button type="danger" size="small" @click="del(index)">删除</el-button></div>
</div>
</div>
<el-button type="primary" size="small" style="margin-top: 10px;width: 100px" @click="addOne">添加</el-button>
</div>`,
        props:{
            modelValue:{
                type:Object,
                default:[]
            },
            width:{
                type:String,
                default:'360px'
            },
        },
        emits:['update:modelValue'],
        switch:{
            modelValue:function (val) {
                console.log(val,'val')
                if(typeof val === 'string'){
                    if(!val){
                        this.inputValue = []
                    }else{
                        this.inputValue = JSON.parse(val)
                    }
                }else{
                    if(Array.isArray(val)){
                        this.inputValue = val
                    }else{
                        this.inputValue = [val]
                    }
                }
                console.log(this.inputValue,'iiiiiiiiiiiiiiiiiiiiiii')
            },
            inputValue:function (val) {
                this.$emit('update:modelValue',val)
            }
        },
        computed:{
            inputValue:function (){
                // console.log("计算")
                let inputValue = []
                if(typeof this.modelValue === 'string'){
                    if(!this.modelValue){
                        inputValue = []
                    }else{
                        inputValue = JSON.parse(this.modelValue)
                    }
                }else{
                    if(Array.isArray(this.modelValue)){
                        inputValue = this.modelValue
                    }else{
                        inputValue = [this.modelValue]
                    }
                }
                return inputValue;
            }
        },
        data(){
            return {

            }
        },
        methods:{
            addOne(){
                // console.log(this.inputValue)
                // console.log('11111111111111')
                let list = this.inputValue?this.inputValue:[];
                let index = list.length+1;
                list.push({
                    label:'',
                    value:''
                })
                this.$emit('update:modelValue',list)
            },
            del(index){
                // console.log(index)
                let list = this.inputValue?this.inputValue:[];
                list.splice(index,1)
                this.$emit('update:modelValue',list)
            }
        }
    }
})